﻿@model IEnumerable<System.Linq.IGrouping<int, CTM.Web.Models.View.Conversation.ConversationViewModel>>
@using CTM.Web.Utils

<div id="timeline" class="timeline-container">
    <button class="timeline-toggle btn btn-default btn-sm pull-right">+ expand all</button>
    <br class="clear">

    @foreach (var group in Model)
    {
        <div class="timeline-wrapper">
            <h2 class="timeline-time">
                <span>@group.Key</span>
            </h2>
            <dl class="timeline-series">

                @foreach (var conversation in group)
                {
                    var cssEmoticon = string.Empty;
                    switch (conversation.Emoticon)
                    {
                        case Emoticon.Smile:
                            cssEmoticon = "fa-smile-o rbvh-emoticon-green";
                            break;
                        case Emoticon.Neutral:
                            cssEmoticon = "fa-meh-o rbvh-emoticon-orange";
                            break;
                        case Emoticon.Frown:
                            cssEmoticon = "fa-frown-o rbvh-emoticon-red";
                            break;
                    }

                    var divRepliesId = "replies-of-" + conversation.Id;
                    var linkRepliesId = "no-comments-of-" + conversation.Id;
                    var divCommentsId = "comments-of-" + conversation.Id;

                    <dt id="@conversation.Id" class="timeline-event">
                        <a>@conversation.Title</a>
                    </dt>
                    <dd class="timeline-event-content" id="@(conversation.Id + "EX")">

                        <div class="pull-left">
                            <label class="close label-emoticon">
                                <span class="fa fa-lg @cssEmoticon"></span>
                            </label>

                            <span class="rbvh-h3">@conversation.CreatedOn.ToString("dd-MMM-yyyy")</span>

                            @switch (conversation.Type)
                            {
                                case CTM.Web.Utils.PostType.Goals:
                                    <span class="label rbvh-conversation-type-label bg-grey-darkgrey">@conversation.Type</span>
                                    break;
                                case CTM.Web.Utils.PostType.Career:
                                    <span class="label rbvh-conversation-type-label bg-blue-aqua">@conversation.Type</span>
                                    break;
                                case CTM.Web.Utils.PostType.Individual:
                                    <span class="label rbvh-conversation-type-label bg-red-bittersweet">@conversation.Type</span>
                                    break;
                                default:
                                    break;
                            }
                            
                            @if(conversation.CreatedBy == GlobalVariables.CurrentUser.Id) {
                                <button type="button" class="close btnDeleteConversation" data-toggle="modal" data-target="#DeleteConversationModal" data-url='@Url.Action("Delete", "Conversation", new { id = conversation.Id })'>
                                    <span class="glyphicon glyphicon-trash font-red"></span>
                                </button>
                                <button type="button" class="close btnEditConversation" data-toggle="modal" data-target="#EditConversationModal" data-url='@Url.Action("Edit", "Conversation", new { id = conversation.Id })'>
                                    <span class="glyphicon glyphicon-edit font-yellow"></span>
                                </button>
                            }

                        </div>

                        <br class="clear">
                        <div class="tagcloud01">
                            <ul>
                                @foreach (var tag in conversation.Tags)
                                {
                                    <li>
                                        <a>@tag.Name</a>
                                    </li>
                                }
                            </ul>
                        </div>

                        <div class="media">
                            <a href="https://connect.bosch.com/profiles/html/profileView.do?key=@conversation.Manager.Id">
                                <img src="@conversation.Manager.Avatar" width="64" height="64" alt="" class="user-avatar" title="@conversation.Manager.DisplayName">
                            </a>
                            @*<p class="mediaLink">
                                    <a href="#inline-1955-08-282" class="CBmodal" title="Related Video: The Emmett Till Murder">Watch: The Emmett Till Murder</a>
                                </p>*@
                        </div><!-- /.media -->
                        <p>
                            @Html.Raw(Html.Encode(conversation.Description).Replace("\n", "<br/>"))
                            <br />
                            <a data-toggle="collapse" href="#@divRepliesId" id="@linkRepliesId">
                                @{
                                var strReply = "reply";
                                if (conversation.Comments.Count > 0)
                                {
                                    strReply = conversation.Comments.Count + " ";
                                    strReply += (conversation.Comments.Count > 1) ? "replies" : "reply";
                                }
                                }
                                @strReply
                            </a>
                        </p>
                        <div id="@divRepliesId" class="panel-collapse collapse">

                            @Html.Action("Create", "Comment", new { id = conversation.Id })

                            <div id="@divCommentsId">
                                @Html.Action("Index", "Comment", new { id = conversation.Id })
                            </div>

                        </div>

                        <br class="clear">
                    </dd><!-- /.timeline-event-content -->
                }

            </dl><!-- /.timeline-series -->
        </div><!-- /.timeline-wrapper -->
    }

    <br class="clear">
</div>

